<template>
    <div id="show">
<div class="header">
    <img src="@STATIC/images/home.png" alt="">
    <img src="@STATIC/images/line.png" alt="">
</div>
<div class="content" id="img">
   <img src="@STATIC/images/picture3.jpg" alt="">
</div>

<div class="footer">
    <img src="@STATIC/images/plante.png" alt="" ref="img">
</div>
    </div>
</template>

<script>
import axios from 'axios'
import Qs from 'qs'
import { constants } from 'fs';
var timer
var list1=[]
export default {
  name:'show',
  data()
  {
    return {}
  },
  
  mounted()
  {
    axios({
    method:'post',
    url:'http://www.homyit.cn/Harry/Img',
    params:{
      
        },
    headers:{'Content-Type': 'application/x-www-form-urlencoded'}
    }).then((res)=>{
      for(var i=0;i<res.data.length;i++)
      {
        list1.push(res.data[i].address)
      }
    }).catch(function(error){
            console.log(error)
    })

    var img = document.getElementById("img");
    var index = 0;
    timer = setInterval(()=>{
            index++;
            index = index % list1.length;
            img.firstChild.src = list1[index];  
       },2000);
  },
  beforeDestroy()
  {
      clearInterval(timer)
  }
}
</script>


<style src="@STATIC/css/show.css" />